/* stem plugin */
(function ($) {

    var padding = 2;

    $.fn.stem = function (opts) {

        //defaults (should override.)
        opts = $.extend({
            focus: {
                l: 0,
                t: 0
            },
            bounds_padding:0,
            // the point to stem from. always override.
            media_path: '' // path to stem images.
        }, opts);

        return $(this).each(function () {

            var $stem = $.fn.stem.$ = $(this);
            $stem.css({
                visibility: 'visible',
                display: 'block'
            });

            // if we're given a jQuery object instead of a rectangle for focus.
            var offset = opts.focus.offset && opts.focus.offset();
            if (offset) {
                opts.focus = {
                    l: offset.left,
                    t: offset.top,
                    w: opts.focus.outerWidth(),
                    h: opts.focus.outerHeight()
                };
            } else { // default width and height are zero.
                opts.focus.w = opts.focus.w || 0;
                opts.focus.h = opts.focus.h || 0;
            }

            // if we're given a jQuery object instead of a rectangle for bounding box.
            offset = opts.bounds && opts.bounds.offset && opts.bounds.offset();

            if (offset) {
                opts.bounds = {
                    l: offset.left + opts.bounds_padding,
                    t: offset.top + opts.bounds_padding,
                    w: opts.bounds.outerWidth() - opts.bounds_padding*2,
                    h: opts.bounds.outerHeight() - opts.bounds_padding*2
                };
            } else { // default width and height are zero.
                opts.bounds.w = opts.bounds.w || 0;
                opts.bounds.h = opts.bounds.h || 0;
            }
            
            // the window to be stemmed.
            var $win = $(opts.frame),

                // stem dimensions
                sw = $stem.outerWidth() || 50,
                sh = $stem.outerHeight() || 50,

                // window dimensions
                ww = $win.outerWidth(),
                wh = $win.outerHeight(),

                // stem position
                sl = opts.focus.l - sw / 2,
                st = opts.focus.t - sh / 2,

                side = 'l',
                wl, wt;

            // if a bounding box is defined, find optimal dialog position.
            if (opts.bounds) {
                left_space = opts.focus.l - opts.bounds.l;
                right_space = opts.bounds.l + opts.bounds.w - opts.focus.l;
                side = (right_space > left_space) ? 'r' : 'l';
            }

            // position stem on left side.
            if (side == 'r') {
                wl = sl + sw - padding;
            }

            // position stem on right side.
            else if (side == 'l') {
                wl = sl - ww + padding;
            }

            wt = st - wh / 2;
            if (opts.bounds) {
                wt = CE.UTIL.constrain(opts.bounds.t, wt, opts.bounds.t + opts.bounds.h - wh);
            }
            // place the stem.
            $stem.css({
                left: sl + 'px',
                top: st + 'px'
            }).attr('src', opts.media_path + 'stem-' + side + '.png');
            
            // place the window.
            $win.css({
                top: wt,
                left: wl
            });

        });
    };
})(jQuery);
